<template>
  <div class="content_container">
   <div class="contentTopWrapper">
    <el-form ref="form" :model="form" :rules="rules" label-width="150px" v-loading="addLoading">
      <el-form-item label="任务名称" prop="name">
        <el-input v-model="form.name" placeholder="定时任务名称" style="width: 600px;"></el-input>
      </el-form-item>

      <el-form-item label="Jira Sql" prop="sql">
        <el-input type="textarea" v-model="form.sql" placeholder="请填写Jira Sql" style="width: 600px;" :autosize="{ minRows: 2, maxRows: 4}"></el-input>
      </el-form-item>

      <el-form-item label="schedule" prop="schedule">
        <el-input v-model="form.schedule" placeholder="定时时间" style="width: 600px;"></el-input>
      </el-form-item>

      <el-form-item label="pic" prop="pic">
        <el-radio v-model="form.pic" label="assignee">assignee</el-radio>
        <el-radio v-model="form.pic" label="developer">developer</el-radio>
        <el-radio v-model="form.pic" label="reporter">reporter</el-radio>
        <el-radio v-model="form.pic" label="qa">qa</el-radio>
        <el-radio v-model="form.pic" label="custom">custom</el-radio>
        <br>
        <el-input v-model="form.custom_person" placeholder="固定通知人;隔开,或者不填通知jira单当前assign人" style="width: 600px;" v-if="form.pic==='custom'"></el-input>
      </el-form-item>

      <el-form-item label="target" prop="target">
        <el-input v-model="form.target" placeholder="通知群" style="width: 600px;"></el-input>
      </el-form-item>

      <el-form-item label="content" prop="content">
        <el-input type="textarea" v-model="form.content" placeholder="通知内容" style="width: 600px;" :autosize="{ minRows: 2, maxRows: 4}"></el-input>
      </el-form-item>

      <el-form-item style="margin-top: 20px">
        <el-button type="primary" @click="queryJiraList()">查询Jira</el-button>
        <el-button type="primary" @click="addTask()">增加任务</el-button>
      </el-form-item>
    </el-form>
   </div>
   <div class="contentBottomWrapper">
    <el-table :data="taskList" stripe v-loading="isTaskLoading">
      <el-table-column label="名称" align="center" width="150">
        <template slot-scope="scope">
          {{ scope.row.name }}
        </template>
      </el-table-column>
      <el-table-column label="schedule" align="center" width="150">
        <template slot-scope="scope">
          {{ scope.row.schedule }}
        </template>
      </el-table-column>
      <el-table-column label="filter" align="center" width="400">
        <template slot-scope="scope">
          {{ scope.row.filter }}
        </template>
      </el-table-column>
      <el-table-column label="PIC" align="center" width="250">
        <template slot-scope="scope">
          {{ scope.row.pic }}
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" width="250">
        <template slot-scope="scope">
          <el-button
            outline
            size="small"
            type="success"
            @click="noticeTask(scope.row.id)"
          >
            立即通知
          </el-button>
          <el-popconfirm
            class="action-btn"
            confirm-button-text="是的"
            cancel-button-text="取消"
            icon="el-icon-info"
            icon-color="red"
            title="确定要删除吗？"
            @confirm="deleteTask(scope.row.id)"
          >
            <el-button size="small" type="danger" slot="reference">
              删除
            </el-button>
          </el-popconfirm>
        </template>
      </el-table-column>
    </el-table>
   </div>

    <el-dialog title="Jira详情" :visible.sync="jiraDialogVisible" width="60%" v-loading="isJiraLoading">
        <el-table :data="jiraList">
          <el-table-column label="版本" align="center" width="250">
            <template slot-scope="scope">
              {{ scope.row.fix_versions }}
            </template>
          </el-table-column>
          <el-table-column label="ticket名" width="250">
              <template slot-scope="{row}">
                  <div slot="reference">
                          <el-link target="_blank" :href="'https://jira.shopee.io/browse/'+row.key" type="primary">{{row.summary}}</el-link>
                  </div>
              </template>
          </el-table-column>
          <el-table-column label="需求状态" align="center" width="250">
            <template slot-scope="scope">
              {{ scope.row.status }}
            </template>
          </el-table-column>

          <el-table-column label="跟进人" align="center" width="250">
            <template slot-scope="scope">
              {{ scope.row.assignee }}
            </template>
          </el-table-column>

          <el-table-column label="QA" align="center" width="250">
            <template slot-scope="scope">
              {{ scope.row.qa }}
            </template>
          </el-table-column>
        </el-table>
    </el-dialog>

  </div>
</template>

<script>
  import {api, postRequest, getRequest} from "@/api/commit";
  export default {
    name: "AddFollower",
    data() {
      return {
        taskList:[],
        jiraList:[],
        isJiraLoading:false,
        isTaskLoading:false,
        addLoading:false,
        jiraDialogVisible:false,
        form: {
          name: '',
          sql: 'reporter = "hao.tian@shopee.com" AND type = Bug ORDER BY created DESC',
          schedule: '0 0 10 * * ?',
          pic: 'assignee',
          custom_person:'',
          target: '',
          content: ''
        },
        rules: {
          name: [
            {required: true, message: 'name不能为空', trigger: 'blur'}
          ],
          sql: [
            {required: true, message: 'sql不能为空', trigger: 'blur'}
          ],
          schedule: [
            {required: true, message: 'schedule不能为空', trigger: 'blur'},
            {
              pattern:
                "^\\s*($|#|\\w+\\s*=|(\\?|\\*|(?:[0-5]?\\d)(?:(?:-|\\/|\\,)(?:[0-5]?\\d))?(?:,(?:[0-5]?\\d)(?:(?:-|\\/|\\,)(?:[0-5]?\\d))?)*)\\s+(\\?|\\*|(?:[0-5]?\\d)(?:(?:-|\\/|\\,)(?:[0-5]?\\d))?(?:,(?:[0-5]?\\d)(?:(?:-|\\/|\\,)(?:[0-5]?\\d))?)*)\\s+(\\?|\\*|(?:[01]?\\d|2[0-3])(?:(?:-|\\/|\\,)(?:[01]?\\d|2[0-3]))?(?:,(?:[01]?\\d|2[0-3])(?:(?:-|\\/|\\,)(?:[01]?\\d|2[0-3]))?)*)\\s+(\\?|\\*|(?:0?[1-9]|[12]\\d|3[01])(?:(?:-|\\/|\\,)(?:0?[1-9]|[12]\\d|3[01]))?(?:,(?:0?[1-9]|[12]\\d|3[01])(?:(?:-|\\/|\\,)(?:0?[1-9]|[12]\\d|3[01]))?)*)\\s+(\\?|\\*|(?:[1-9]|1[012])(?:(?:-|\\/|\\,)(?:[1-9]|1[012]))?(?:L|W)?(?:,(?:[1-9]|1[012])(?:(?:-|\\/|\\,)(?:[1-9]|1[012]))?(?:L|W)?)*|\\?|\\*|(?:JAN|FEB|MAR|APR|MAY|JUN|JUL|AUG|SEP|OCT|NOV|DEC)(?:(?:-)(?:JAN|FEB|MAR|APR|MAY|JUN|JUL|AUG|SEP|OCT|NOV|DEC))?(?:,(?:JAN|FEB|MAR|APR|MAY|JUN|JUL|AUG|SEP|OCT|NOV|DEC)(?:(?:-)(?:JAN|FEB|MAR|APR|MAY|JUN|JUL|AUG|SEP|OCT|NOV|DEC))?)*)\\s+(\\?|\\*|(?:[0-6])(?:(?:-|\\/|\\,|#)(?:[0-6]))?(?:L)?(?:,(?:[0-6])(?:(?:-|\\/|\\,|#)(?:[0-6]))?(?:L)?)*|\\?|\\*|(?:MON|TUE|WED|THU|FRI|SAT|SUN)(?:(?:-)(?:MON|TUE|WED|THU|FRI|SAT|SUN))?(?:,(?:MON|TUE|WED|THU|FRI|SAT|SUN)(?:(?:-)(?:MON|TUE|WED|THU|FRI|SAT|SUN))?)*)(|\\s)+(\\?|\\*|(?:|\\d{4})(?:(?:-|\\/|\\,)(?:|\\d{4}))?(?:,(?:|\\d{4})(?:(?:-|\\/|\\,)(?:|\\d{4}))?)*))$",
              message: "请输入正确的Cron表达式"
            }
          ],
          pic: [
            {required: true, message: 'pic不能为空', trigger: 'blur'}
          ],
          target: [
            {required: true, message: 'target不能为空', trigger: 'blur'}
          ],
          content: [
            {required: true, message: 'target不能为空', trigger: 'blur'}
          ],
        }
      }
    },
    methods: {
      queryJiraList() {
        try {
          this.jiraDialogVisible = true
          this.isJiraLoading = true
          postRequest(api['get_jira_list'], {jql:this.form.sql}).then((res)=>{
            this.jiraList = res.resultReturn.data
            this.isJiraLoading = false
          },(error)=>{
            this.$message({
              message: '查询jira失败,请检查你的sql!',
              type: 'warning',
            });
          })
        } catch (e) {
          this.$message({
            message: '查询jira失败,请检查你的sql!',
            type: 'warning',
          });
        }
      },

      queryTaskList() {
        this.isTaskLoading = true
        postRequest(api['get_noti_task']).then((res)=>{
          this.taskList = res.resultReturn.data
          this.isTaskLoading = false
        },(error)=>{
          this.$message({
            message: '查询task失败,请联系QA!',
            type: 'warning',
          });
        })
      },

      noticeTask(id) {
        this.isTaskLoading = true
        postRequest(api['noti_task'], {id:id}).then((res)=>{
          this.queryTaskList()
        },(error)=>{
          this.resultReturn = "请检查您的密码是不是有问题"
        })
      },

      deleteTask(id) {
        this.isTaskLoading = true
        postRequest(api['delete_noti_task'], {id:id}).then((res)=>{
          this.queryTaskList()
        },(error)=>{
          this.resultReturn = "请联系QAcheck"
        })
      },

      addTask() {
        let params = Object.assign({}, this.form);
        if (params.pic==='assignee'){
          params.pic = "assignee"
        }  else if (params.pic==='developer'){
          params.pic = "developer"
        } else if (params.pic==='reporter'){
          params.pic = "reporter"
        } else if (params.pic==='qa') {
          params.pic = "qa"
        } else {
          params.pic = params.custom_person
        }
        params.filter = params.sql
        delete params.sql
        delete params.custom_person
        this.addLoading = true
        postRequest(api['add_noti_task'], params).then((res)=>{
          this.queryTaskList()
          this.addLoading = false
        },(error)=>{
          this.resultReturn = "请联系QAcheck"
          this.addLoading = false
        })
      }
    },
    created() {
      this.queryTaskList()
    },
  }
</script>

<style scoped>
  .content_container {
    display: flex;
    flex-direction: column;
  }
  .content_container .contentTopWrapper {
    margin-top: 10px;
    flex: 1;
  }
  .content_container .contentBottomWrapper {
    margin-left: 100px;
    width: 1200px;
  }
</style>
